<template>
    <div>
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-date"></i> 消息群发</el-breadcrumb-item>
              <!--   <el-breadcrumb-item>编辑器</el-breadcrumb-item> -->
                
                </el-breadcrumb>
        </div>
        <div class="container">
            <div class="plugins-tips">
                <!-- Vue-Quill-Editor：基于Quill、适用于Vue2的富文本编辑器。
                访问地址：<a href="https://github.com/surmon-china/vue-quill-editor" target="_blank">vue-quill-editor</a> -->
                消息编辑
                
                <!-- <div v-html="content">
                    
                </div> -->
            </div>
            <quill-editor ref="myTextEditor" v-model="content" :options="editorOption"></quill-editor>
            <el-button class="editor-btn" type="primary" @click="submit">发送消息</el-button>
        </div>
    </div>
</template>

<script>
    import 'quill/dist/quill.core.css';
    import 'quill/dist/quill.snow.css';
    import 'quill/dist/quill.bubble.css';
    import { quillEditor } from 'vue-quill-editor';
    export default {
        name: 'editor',
        data: function(){
            return {
                content: '',
                editorOption: {
                    placeholder: 'Hello World'
                },
            }
        },
        components: {
            quillEditor
        },
        methods: {
            onEditorChange({ editor, html, text }) {
                this.content = html;
            },
            submit(){
                console.log(this.content);

                var token='Bearer '+sessionStorage.getItem("Token");
                let config = {
                    headers: {
                        'Authorization':token,
                    }
                };
                console.log(token);
                // var url = "/api/log/sendMsg?"+"message="+this.content;
                // console.log(url);

                 var fd = new FormData();
                fd.append("message",this.content);
                // fd.append("password",this.ruleForm2.password);
                
                this.$axios.post("/api/log/sendMsg",fd,config).then( res => {

                // this.$axios.get(url,config).then(res=> {
                    console.log(res);
                    if(res.data.code===1) {
                        this.$message.success("发送消息成功");
                    } else {
                        this.$message.error("发送消息失败");
                    }
                }).catch( res => {
                    console.log(res);
                    this.$message.error("发送消息失败");
                })

            },
           

        }
    }
</script>
<style scoped>
    .editor-btn{
        margin-top: 20px;
    }
</style>